<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:p="http://primefaces.prime.com.tr/ui">
	<h:head>
		<title>Registro de Persona</title>
		<meta http-equiv="X-UA-Compatible" content="IE=7" />
		<meta content='text/html; charset=UTF-8' http-equiv='Content-Type' />
		<link type="text/css" rel="stylesheet" href="css/default.css" />
		<link type="text/css" rel="stylesheet" href="themes/owner/skin.css" />

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
	</h:head>
	<body>
	<h:form id="formRegPer">
	<table>
	<tr>
	<td><h:outputText value="Seleccione el Tipo de Reporte" /> </td>
	<td><h:selectOneListbox value="#{transparenciaBM.tipoReporte}" size="1">
			<f:selectItem itemLabel="--Seleccione un Tipo de Reporte--" itemValue="-1"/>
			<f:selectItem itemLabel="Reporte Semanal" itemValue="1"/>
			<f:selectItem itemLabel="Reporte Mensual" itemValue="2"/>
		</h:selectOneListbox></td>
	<td>		<p:commandButton value="Aceptar"
			actionListener="#{transparenciaBM.generarIndicador}" update="saldra"
			ajax="false"/></td>
	</tr>
	<tr>
	<td colspan="3">
	<p:outputPanel id="saldra">
			<script type="text/javascript" src="https://www.google.com/jsapi"></script>
			<script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = new google.visualization.DataTable();
        <h:outputFormat value="#{transparenciaBM.grafico.dataChar}"/>

        var options = {
          width: 720, height: 432,
          title: '#{transparenciaBM.grafico.titulo}',
          vAxis: {title: '#{transparenciaBM.grafico.tituloEjeX}', titleTextStyle: {color: '#1DA4E8'}},
          hAxis: {title: '#{transparenciaBM.grafico.tituloEjeY}', titleTextStyle: {color: '#2C1BE3'}}
        };

        var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>
			<div id="chart_div"></div>
		</p:outputPanel>
	</td>
	</tr>
	</table>
	</h:form>
	
	</body>
</html>